<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0">
	<link rel="stylesheet" href="../res/css/weui.css" />
    <link rel="stylesheet" href="../res/css/weuix.css" />
	<link rel="stylesheet" href="../res/css/common.css" />
    <title></title>
	<script src="../res/js/zepto.min.js"></script>
	<script src="../res/js/zepto.weui.js"></script>
    <!-- <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> -->
    <script src="../res/js/vue.min.js"></script>
	<script src="../res/js/common.js?v=1"></script>

    <style>
        body{
            height: 100%;
        }
        #app{
            display: flex;
            flex-direction: column;
            align-items: stretch;
            min-height: 100%;
        }
        .top-bar{
            position: sticky;
            position: -webkit-sticky;
            top: 0;
            z-index: 9;
            box-shadow: 0 0 8px -4px #e0e0e0;
        }
        .center-list {
            background-color: #fff;
            margin: 15px;
            padding: 10px;
            border-radius: 8px;
        }
        .center-item {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding-bottom: 15px;
            margin-bottom: 15px;
            border-bottom: 1px solid #E0E0E0;
        }
        .center-item:last-child {
            padding-bottom: 0;
            margin-bottom: 0;
            border-bottom: none;
        }
        .center-item-left {
            display: flex;
            align-items: center;
        }
        .center-item-left img {
            width: 30px;
            height: 30px;
            margin-right: 5px;
        }
    </style>
</head>
<body>
    <main id="app">
        <div class="weui-btn_primary weui-header top-bar">
            <div class="weui-header-left"><a class="icon icon-109" @click="pageBack"></a></div>
            <h1 class="weui-header-title">订单中心</h1>
        </div>
        <div class="center-list">
            <div class="center-item" v-for="item in iconListData" :key="item.id" @click="gotopage(item.id)">
                <div class="center-item-left">
                    <img :src="item.icon_img"></img>
                    <span>{{item.icon_name}}</span>
                </div>
                <div><img style="width: 10px; height: 10px;" src="../res//images/arrow-Pulldown.png"></div>
            </div>
        </div>
    </main>
</body>
<script>
new Vue({
    el: '#app',
    data: {
        iconListData: [{
        'icon_img': '../res/images/icon_drug_order.png',
        'icon_name': '药品订单',
        'id': '1'
      },
      {
        'icon_img': '../res/images/icon_inquiry_order.png',
        'icon_name': '问诊订单',
        'id': '2'
      },
      {
        'icon_img': '../res/images/icon_reacd.png',
        'icon_name': '交易记录',
        'id': '3'
      }
    ]
    },
    methods: {
        pageBack(){
            history.back()
        },
        gotopage(id) {
            let url = ''
            let openid = getQst("openid").trim();
		    let orgid = getQst("orgid").trim();
            let user_id = getUserId()
            switch (id){
                case '1':
                    url = 'user_list.htm?orgid=' + orgid + '&openid=' + openid + '&user_id=' + user_id + '&isIndex=0'
                    break;
                case '2':
                    url = 'inquiry_order_list.htm?orgid=' + orgid + '&openid=' + openid + '&user_id=' + user_id
                    break;
                case '3':
                    url = 'transaction_record.htm'
                    break;    
                default:
                    break;
            }
            goPage(url)
        }
    },
})
</script>

</html>